<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>热门小镇</title>
    <style>
        body{
            font-size: 12px;
            color: gray;
        }

        .main {
            width: 700px;
            border: 1px solid gray;
        }

        .box1 {
            margin: 10px;
        }

        .box2 {
            display: flex;
            justify-content: space-between;
            margin-bottom: 20px;
        }
        .box3{
            display: flex;
            margin-top: 20px;
        }

        .box3_text{
            display: flex;
            flex-direction: column;
        }

        .box3_img{
            border: 1px solid gray;
            border-radius: 5px;
            margin-right: 15px;
        }
        .box3_text1{
            font-size: 16px;
            color: blue;
        }

        .box3_text2{
            margin-top: 5px;
        }
    </style>
</head>

<body>
    <div class="main">
        <div class="box1">
            <span style="font-weight: bolder; font-size: 18px;">摄影社区热门小镇</span>
            <div class="box2">
                <div class="box3">
                    <div class="box3_img">
                        <img src="img/pic_01.jpg" alt="" style="display: block; padding: 3px;">
                    </div>
                    <div class="box3_text">
                        <span class="box3_text1">风景狙击手</span>
                        <span class="box3_text2">成员 ：80</span>
                        <span class="box3_text2">作品 ：286</span>
                    </div>
                </div>
                <div class="box3" style="margin-right: 48px;">
                    <div class="box3_img">
                        <img src="img/pic_02.jpg" alt="" style="display: block; padding: 3px;">
                    </div>
                    <div class="box3_text">
                        <span class="box3_text1">叙事感</span>
                        <span class="box3_text2">成员：235</span>
                        <span class="box3_text2">作品：116</span>
                    </div>
                </div>
                <div class="box3" style="margin-right: 48px;">
                    <div class="box3_img">
                        <img src="img/pic_03.jpg" alt="" style="display: block; padding: 3px;">
                    </div>
                    <div class="box3_text">
                        <span class="box3_text1">定焦视界</span>
                        <span class="box3_text2">成员：56</span>
                        <span class="box3_text2">作品：456</span>
                    </div>
                    
                </div>
                
            </div>

            <div class="box2">
                <div class="box3">
                    <div class="box3_img">
                        <img src="img/pic_04.jpg" alt="" style="display: block; padding: 3px;">
                    </div>
                    <div class="box3_text">
                        <span class="box3_text1">中画幅乐园</span>
                        <span class="box3_text2">成员 ：120</span>
                        <span class="box3_text2">作品 ：239</span>
                    </div>
                </div>
                <div class="box3">
                    <div class="box3_img">
                        <img src="img/pic_05.jpg" alt="" style="display: block; padding: 3px;">
                    </div>
                    <div class="box3_text">
                        <span class="box3_text1">《卡啪》先锋...</span>
                        <span class="box3_text2">成员 ：78</span>
                        <span class="box3_text2">作品 ：125</span>
                    </div>
                </div>
                <div class="box3">
                    <div class="box3_img">
                        <img src="img/pic_06.jpg" alt="" style="display: block; padding: 3px;">
                    </div>
                    <div class="box3_text">
                        <span class="box3_text1">植物的无声世界</span>
                        <span class="box3_text2">成员 ：235</span>
                        <span class="box3_text2">作品 ：1258</span>
                    </div>
                </div>
                
            </div>
        </div>
    </div>
</body>

</html>